<template>
	<view class="rule_container">
		<!-- 加分规则 -->
		<view class="mt30">
			<view class="">
				加分规则
			</view>
			<view class="u-content mt30">
				<table style="border: 2rpx solid #000;">
					<thead>
						<tr class="flex" style="background: #F9D8D8;">
							<th>加分项</th>
							<th class="tr_centers">操作</th>
							<th class="tr_grade">分数</th>
						</tr>
					</thead>
					<tbody>
						<tr class="flex">
							<td>参加活动</td>
							<td class="tr_center">签到、签退</td>
							<td class="tr_grade">6</td>
						</tr>
						<tr class="flex">
							<td>发布需求</td>
							<td class="tr_center">发布成功</td>
							<td class="tr_grade">10</td>
						</tr>
						<tr class="flex">
							<td>沟通需求</td>
							<td class="tr_center">与需求发布方聊天</td>
							<td class="tr_grade">10</td>
						</tr>
					</tbody>
				</table>
			</view>
		</view>
		<!-- 扣分规则 -->
		<view class="mt30">
			<view class="">
				扣分规则
			</view>
			<view class="u-content mt30">
				<table style="border: 2rpx solid #000;">
					<thead>
						<tr class="flex" style="background: #F9D8D8;">
							<th>扣分项</th>
							<th class="tr_centers">操作</th>
							<th class="tr_grade">分数</th>
						</tr>
					</thead>
					<tbody>
						<tr class="flex">
							<td>报名不参加活动</td>
							<td class="tr_center">报名成功，未参与</td>
							<td class="tr_grade">-3</td>
						</tr>
						<tr class="flex">
							<td>发布需求</td>
							<td class="tr_center">发布错误需求，或广告</td>
							<td class="tr_grade">-10</td>
						</tr>
						<tr class="flex">
							<td>沟通需求</td>
							<td class="tr_center">骚扰别人被举报核实</td>
							<td class="tr_grade">-10</td>
						</tr>
					</tbody>
				</table>
			</view>
		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {

			}
		},
	}
</script>

<style lang="scss" scoped>
	.rule_container {
		width: 90%;
		margin: 0 auto;

		.u-content {
			th {
				border: 1rpx solid #D9D9D9;
				width: 280rpx;
				height: auto;
				display: flex;
				justify-content: center;
				align-items: center;
				padding: 8rpx 0;
			}

			td {
				border: 1rpx solid #D9D9D9;
				width: 280rpx;
				text-align: center;
				height: auto;
				display: flex;
				justify-content: center;
				align-items: center;
				padding: 8rpx 0;
			}
			.tr_centers{
				width: 350rpx;
			}

			.tr_center {
				width: 350rpx;
				display: flex;
				justify-content: flex-start;
				text-align: left;
			}

			.tr_grade {
				width: 200rpx;
			}
		}
	}
</style>